<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml" xmlns:v-bind="http://www.w3.org/1999/xhtml"
      xmlns:text-align="http://www.w3.org/1999/xhtml">
<head>
    <title>已发送</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="shortcut icon" href="/dist/img/icon.png" type="image/x-icon">
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="/dist/plugins/bootstrap/css/bootstrap.min.css">
    <!--&lt;!&ndash; Font Awesome &ndash;&gt;-->
    <link rel="stylesheet" href="/dist/css/font-awesome.min.css">
    <!--&lt;!&ndash; Ionicons &ndash;&gt;-->
    <link rel="stylesheet" href="/dist/css/ionicons.min.css">
    <!--插件样式-->
    <link href="/dist/plugins/ztreem/css/zTreeStyle/zTreeStyle.css" rel="stylesheet"/>
    <!--OA主样式-->
    <link rel="stylesheet" href="/dist/css/OA.min.css?t=4a6c1b54">
    <link rel="stylesheet" href="/dist/css/skins/OA-skins.min.css?t=16f1e6f3">
    <!--easyui-->
    <link href="/dist/plugins/easyui/themes/icon.css" rel="stylesheet" type="text/css"/>
    <link href="/dist/plugins/easyui/themes/default/menu.css" rel="stylesheet" type="text/css"/>
    <style type="text/css">
        .hidden {
            display: none;
        }

        .hunstyle {
            background: #9d9d9d;
        }

        .readed td {
            font-weight: bold;
        }

        .table > thead > tr > th {
            border: 1px solid #ddd;
        }

        #tbList tr td:first-child i {
            width: 6px;
            height: 6px;
            margin: 0 15px;
            background: url("/dist/img/icon-email.png");
            display: inline-block;
        }

        #tbList tr.readed td:first-child i {
            background: url("/dist/img/icon-email-active.png");
        }

        .divCheck{
            width: 80px;
            height: 100%;
            margin-left: 5px;
            line-height: 25px;
        }
        .divCheck input{
            float: left;
            margin-top: 7px;
            margin-right: 5px;
        }
        /***************************所有人员tree************************/
        #allUsers {
            border: 5px solid #a5bacf;
            position: absolute;
            background-color: White;
            left: 300px;
            top: 20px;
            height: 500px;
            width: 700px;
            line-height:0px;
            display:none;
            z-index: 111111;
        }


        #toolBar {
            height: 30px;
            line-height:29px;
            border-bottom: 1px solid #a5bacf;
            width: 100%;
            box-sizing: border-box;
            line-height:0px;
            z-index:9999;
        }

        #toolBar .search-text {
            box-sizing: border-box;
            height:24px;
            text-indent:3px;
            border:0 none;
            width:200px;
            margin-top:0px;
            padding-top:0px;
            position:relative;
            top:-2px;
            margin-bottom:0px;
            outline: none;
        }
        #toolBar .my-close {
            display:inline-block;
            padding:0px;
            margin:0px;
            width:29px;
            height: 29px;
            line-height:25px;
            font-size: 23px;
            cursor: pointer;
            text-align: center;
            font-weight: bold;
        }
        #toolBar .my-close:hover {
            background-color: #c72327;
            font-weight: bold;
            font-size: 25px;
            color: #FFF;
            line-height:23px;
        }
        .search-button {
            width: 14px;
            height: 14px;
            background-image: url(/dist/img/glass.jpg);
            border: 0 none;
            cursor: pointer;
            margin-top:0px;
        }
        input[type=button]{
            outline: none;
        }
        #allUsers .ztree li ul.line
        {
            width:0px;
            background-color:Red;
        }
        #allUsers .bottom_docu
        {
            background: none;
            width: 0px;
        }
        #allUsers .ztree li.fleft
        {
            width: 50px;
            float: left;
            overflow: hidden;
        }
        #control{
            width: 10px;
            right: 0;
            top:0;
            border: 1px solid #000;
            border-top-width: 0;
            border-bottom-width: 0;
            background: #ededed;
            cursor: e-resize;
            height: 100%;
            position: absolute;

        }
        .tmp-line{
            width: 10px;
            right: 0;
            border: 1px solid #000;
            border-top-width: 0;
            border-bottom-width: 0;
            background: #ededed;
            cursor: e-resize;
            height: 100%;
            position: absolute;

        }
        .false .hide_a a{display: inline-block}
        .true .hide_a a{display: none}
    </style>

</head>
<body style="background-color:#fff">
<iframe id="ifAttach" style="display:none"></iframe>
<section class="content" id="app">
    <div class="row">
        <div class="col-md-12" id="divAll">
            <div class="col-md-6" id="divMiddle">
                <div class="box-body no-padding box-border"
                     style="overflow: auto;background: #fff;border-right: 10px solid #ededed;">
                    <div class="box-header with-border" style="background: #f7f8fa;">

                        <div class="pull-right ">
                            <div class="has-feedback">
                                <input id="searchKey" type="text" class="form-control input-sm"
                                       placeholder="请输入关键字">
                                <span id="btnQuery"
                                      class="glyphicon glyphicon-search form-control-feedback"></span>
                            </div>
                        </div>
                        <div class="oa-pager pull-right" style="margin-right: 10px;"><span id="nowPage">1</span>/<span
                                id="allPage">1</span>&nbsp;&nbsp;&nbsp;
                            <span id="prev" class="oa-pager-button">上一页</span> <span id="next" class="oa-pager-button">下一页</span>
                        </div>


                        <div class="clearfix"></div>
                        <!-- /.box-tools -->
                    </div>
                    <div class="box-body no-padding iframeH2" style="overflow: auto;" id="scrollDiv">
                        <div class="table-responsive mailbox-messages">
                            <div id="progress" class="wyui-progress"></div>
                            <div class="wyui-datagrid">
                                <table class="table table-hover ">
                                    <thead>
                                    <tr>
                                        <th class="text-center tableTitle">主题</th>
                                        <th class="text-center tableTitle" style="width: 150px;">发件时间</th>
                                        <th class="text-center tableTitle" style="width: 150px;">操作</th>
                                    </tr>
                                    </thead>
                                    <tbody id="tbList">
                                    <tr v-for="email in list_emails" @click="getById(email)" :class="isShow(email)?'true':'false'"
                                        @dblclick="openPresentation(email)">
                                        <td>{{email.subject}}</td>
                                        <td class="text-center">{{email.createTime}}</td>
                                        <td class="text-center hide_a"> <a href="javascript:void(0);" @click.stop="deleteDraft(email)">删除</a></td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div id="control"></div>
            </div>
            <div class="col-md-6" id="rightDiv">
                <div class="box-body no-padding " style="overflow: auto;background: #fff;">
                    <div class="box-header with-border text-center">
                        <input type="button" class="btn oaBtn btn-sm" @click="reply('reply')"
                               id="reply" value="回复"/>

                        <input type="button" class="btn oaBtn btn-sm" @click="reply('replyAll')"
                               id="replyAll" style="width: 90px;margin:0 10px;" value="回复全部"/>
                        <!--<button type="button" class="btn btn-default btn-sm">回复并抄送</button>-->
                        <input type="button" class="btn oaBtn btn-sm" @click="reply('foward')"
                               id="foward" value="转发"/>
                    </div>
                    <div class="box-body no-padding iframeH2" style="overflow: auto;" >
                        <div class="mailbox-read-info " v-if="email != null">
                            <h2 style="font-size:15px;font-weight: bold;">{{email.mains.subject}}</h2>
                            <address style="background: #f7f8fa; padding: 10px;">
                                发&nbsp;&nbsp;件&nbsp;&nbsp;人：<b>{{email.mains.sender}}</b><br>
                                收&nbsp;&nbsp;件&nbsp;&nbsp;人：<span v-for="user in email.receivers"><b>{{user.userName}};</b></span><br>
                                抄&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;送：<span
                                    v-for="user in email.copiers"><b>{{user.userName}};</b></span><br>
                                时&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;间：<b>{{email.mains.createTime}}</b><br>
                                <div v-bind:class="{hide: email.mains == null || email.mains.etype == 0}">
                                    工作报告：<a href="javascript:void(0);"
                                            @click="reportDetail(email.mains.dataId)"><b>查看详细〉〉</b></a><br></div>
                                <span class="pull-left" v-bind:class="{hide: email.attaches.length==0}">附&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;件：</span>
                                <div class="pull-left text-left" v-bind:class="{hide: email.attaches.length==0}">
                                    <a v-for="attach in email.attaches" @click="download(attach.url,attach.name)"
                                       href="javascript:void(0);" target="_self"
                                       style="color: #0c67b4;display: block;">{{attach.name}}</a><br>
                                </div>
                                <div class="clearfix"></div>
                            </address>
                        </div>
                        <div class="mailbox-read-message" v-html="email.mains.content" v-if="email != null">

                        </div>
                    </div>
                </div>
            </div>
        </div>


    </div>
</section>

<script src="https://file.ggxqce.com/web/jquery-2.2.3.min.js"></script>
<script src="https://file.ggxqce.com/web/bootstrap.min.js"></script>
<!--easyui-->
<script src="/dist/plugins/easyui/plugins/jquery.parser.js" type="text/javascript"></script>
<script src="/dist/plugins/easyui/plugins/jquery.menu.js" type="text/javascript"></script>
<!--框架已定义 JS-->
<script src="/dist/js/app_iframe.js?t=602456c3"></script>
<script src="/dist/js/oa.js?t=ff1c9bf8"></script>
<script src="/dist/plugins/vue/vue.js"></script>
<script type="text/javascript" src="/dist/plugins/ztreem/js/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript" src="/dist/plugins/ztreem/js/jquery.ztree.exedit-3.5.js"></script>
<script type="text/javascript" src="/dist/plugins/ztreem/js/jquery.ztree.exhide-3.5.js"></script>
<script type="text/javascript" src="/dist/plugins/ztreem/js/jquery.ztree.excheck-3.5.js"></script>
<!--<script src="/dist/js/pages/email/inbox.js?v1.18"></script>-->
<script src="/dist/js/pages/email/emailSent.js?v1.18"></script>
<script>
    /************************页面拖拽******************************/

    var resize = {
        curTarget: null,
        curTmpTarget: null,
        curTargetId: null,
        noSel: function () {
            try {
                window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();
            } catch (e) { }
        },
        bindSelect: function () {
            return false;
        },
        bindDom: function () {
            $("#control").bind("mousedown", resize.bindMouseDown);
        },
        bindMouseDown: function (e) {
            if ($("#allUsers").is(":visible")) return;
            var target = e.target;
            var doc = $(document), target = $(target),
                    docScrollTop = doc.scrollTop(),
                    docScrollLeft = doc.scrollLeft();
            resize.curTarget = target;
            resize.curTargetId = target[0].id;
            doc.bind("mousemove", resize.bindMouseMove);
            doc.bind("mouseup", resize.bindMouseUp);
            doc.bind("selectstart", resize.docSelect);

            if (e.preventDefault) {
                e.preventDefault();
            }
            if (e.stopPropagation) {
                e.stopPropagation();
            }
        },
        bindMouseMove: function (e) {
            resize.noSel();
            var doc = $(document),
                    docScrollTop = doc.scrollTop(),
                    docScrollLeft = doc.scrollLeft(),
                    tmpTarget = resize.curTmpTarget,
                    target = resize.curTarget;
            console.log(e.clientX,docScrollLeft)
            console.log(tmpTarget,target)
            if (tmpTarget) {
                console.log(e.clientX)
//                    var left1 = $("#control").position().left;
                if (e.clientX<300||e.clientX>$("#divAll").width()-300) return;
//                    if (e.clientX >= $("#body").width() - 50) return;
                tmpTarget.css({'left':e.clientX,'top':'15px'});

            } else {
                if (target) {
                    console.log(222)
                    curDom = $("<div class='tmp-line' style='height:" + target.height() + "px'></div>");
                    curDom.appendTo(".row");
                    var left1 = $("#control").offset().left;
                    curDom.css({
                        "top": "15px",
                        "left": left1+"px"
                    });
                    resize.curTmpTarget = curDom;
                }
            }
            return false;
        },
        bindMouseUp: function (e) {
            var doc = $(document);
            doc.unbind("mousemove", resize.bindMouseMove);
            doc.unbind("mouseup", resize.bindMouseUp);
            doc.unbind("selectstart", resize.docSelect);
            var target = resize.curTarget, tmpTarget = resize.curTmpTarget;
            if (target && tmpTarget) {
                var value=$("#control").offset().left-tmpTarget.offset().left;
                console.log(value)
                console.log($("#divAll").width()-$("#rightDiv").width()-$("#inboxGroup").width());
                console.log($("#rightDiv").width(),$("#rightDiv").width()+value);

                $("#divMiddle").width($("#divMiddle").width()-value);
                $("#rightDiv").width($("#divAll").width()-$("#divMiddle").width()-$("#inboxGroup").width()-50);

                tmpTarget.remove();
                resize.curTmpTarget="";
            }
        }
    };
    resize.bindDom();
</script>
<script>
    /************************滚动加载******************************/
    var divscroll = document.getElementById('scrollDiv');
    function divScroll() {
        var wholeHeight = divscroll.scrollHeight;
        var scrollTop = divscroll.scrollTop;
        var divHeight = divscroll.clientHeight;
        console.log(scrollTop + divHeight,wholeHeight)
        if(scrollTop + divHeight >= wholeHeight-2){
//            alert('滚动到底部了！');
            if(isLoad){
                isLoad=false;
                setTimeout( $.wyui.page.getByPage("scroll"),1000);

            }

            //这里写动态加载的逻辑，比如Ajax请求后端返回下一个页面的内容
        }

    }
    divscroll.onscroll = divScroll;
</script>

</body>
</html>